<!DOCTYPE html>
<html>

<meta charset="utf-8">
<meta content="IE=9" http-equiv="x-ua-compatible">
<head th:include="include :: header"></head>

<body class="gray-bg">
	<div id="dialogSpec"  style="padding: 0 15px">
		<div  style="min-width: 600px;" >
				<div  style="min-height: 300px;">
					<div class="row">
						<div class="col-xs-12" style="float: left" >
							<div id="specParent">


								<div class="spec" th:each="spList : ${specList}" style="float: left;padding-right: 10px;padding-left: 10px" th:attr="data-spec-name=${spList.spec.name},data-spec-type=${spList.spec.type},data-spec-id=${spList.spec.id}"   >
									<span class="h5 mb10" style="float: left"><input class="specChkAll" type="checkbox"><strong th:text="${spList.spec.name}"></strong></span>
									<div style="float: left;padding-left: 20px;">

										<div class="vl" th:each="sVList : ${spList.specValList}" >
											<input th:id="${sVList.specValueId}" type="checkbox" th:value="${sVList.specValueId}"
												   th:title="${sVList.specValText}"><span th:text="${sVList.specValText}"></span>
										</div>

									</div>
								</div>

							</div>
						</div>
						<div class="col-xs-12" style="padding-top: 5px;height: 45px;">
							<button id="doProduct" type="button" class="btn btn-primary btn-sm">生成所有货品</button>
						</div>
						<div style="width: 100%;text-align: center;margin-top: 10px;">
							<table id="plist" class="table table-bordered table-striped table-condensed" style="width: 95%;margin: 20px;">
								<thead>
								<tr>
									<th>规格值</th>
									<th>货号</th>
									<th class="numeric">上架</th>
									<th class="numeric">库存</th>
									<th class="numeric">最小购买</th>
									<th class="numeric">最大购买</th>
									<th class="numeric">市场价</th>
									<th class="numeric">用户价</th>
                                     <th class="numeric">团长价</th>
                                    <th class="numeric">核心价</th>
									 <th class="numeric">合伙人价</th>
									<!-- <th class="numeric" style="display: none">成本价</th> -->
									
                                    <th class="numeric">运险费</th>
									<!--<th class="numeric">高级分销自反</th> -->
                                   <!-- <th class="numeric">运费</th>-->
                                    <th class="numeric">接单价</th>
									<th class="numeric">重量(g)</th>
									<th class="numeric">默认货品</th>
									<!--<th class="numeric">操作</th>-->
								</tr>
								</thead>
								<tbody>
								</tbody>
							</table>
						</div>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">取 消</button>
					<button id="dialogSpecOK" type="button" class="btn btn-primary" data-loading-text="保存...">保 存</button>
				</div>

		</div>
	</div>


	<div th:include="include :: footer"></div>

	<script language="JavaScript" th:inline="none">
        function getSpec(){
            var specs=[];
            $("#dialogSpec").find("div .spec").each(function(){
                var self=$(this);
                var spec={};
                var spec_values=[];
                spec.spec_name=$(this).attr("data-spec-name");
                spec.spec_type=$(this).attr("data-spec-type");
                spec.spec_id=$(this).attr("data-spec-id");
                self.find("div .vl").each(function(){
                    var v={};
                    v.spec_name=spec.spec_name;
                    v.spec_type=spec.spec_type;
                    v.spec_id=spec.spec_id;
                    var chk=false;
                    $(this).find("img[class='specImg']").each(function(){
                        v.spec_value_imgurl=$(this).attr("src");
                    });
                    $(this).find("input[type=checkbox]").each(function(){
                        v.spec_value_id=$(this).val();
                        v.spec_value_name=$(this).attr("title");
                        chk=$(this).prop("checked");
                    });
                    if(chk){
                        spec_values.push(v);
                        spec.spec_values=spec_values;
                    }
                });
                if(spec_values.length>0){
                    specs.push(spec);
                }

            });
            return specs;
        }
        function getProducts(specs) {
        	
            if (!specs || specs.length == 0) {
                return [];
            } else {
            	
                return joinSpec([[]], specs, 0, specs.length-1);
            }
            function joinSpec(prevProducts, specs, i, max) {
                var currentProducts = [], currentProduct, currentSpecs = specs[i];
                if ( i > max ) {
                    return prevProducts;
                }
                $.each(prevProducts,function(i,prevProduct) {
                    $.each(currentSpecs,function(j,spec) {
                        currentProduct = prevProduct.slice(0);
                        currentProduct.push(spec);
                        currentProducts.push(currentProduct);
                    });
                });
                return joinSpec(currentProducts, specs, ++i, max);
            }
        }
        </script>
        <script language="JavaScript" th:inline="javascript">

        $(document).ready(function () {
            var valueSpec =[];
			if([[${type}]]==1){
                var proStr = JSON.parse(sessionStorage.getItem("products"));
                console.log("子页面取sessionStorage的值");
                console.log(proStr);
                console.log(proStr.length);
                if (proStr== undefined || proStr==null || proStr ==''){

                }else {
                    // var pList ='';
					for (var i=0;i<proStr.length;i++){
                        var str="<tr>";
                        str+="<td>"+proStr[i].spec+"</td>";
                        str+="<input type='hidden' name='productId' value='"+proStr[i].id+"'>";
                        str+="<td><input name='sku' type='text' class='form-control'  value='"+proStr[i].sku+"' style='height: 22px;width: 80px;padding: 0 2px;'></td>";
                        str+="<td><input name='up' type='checkbox' checked></td>";
                        str+="<td><input name='stock' type='text' class='form-control' value='"+proStr[i].stock+"' style='height: 22px;width: 60px;padding: 0 2px;'></td>";
                        str+="<td><input name='buyMin' value='"+proStr[i].buyMin+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";
                        str+="<td><input name='buyMax' value='"+proStr[i].buyMax+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";
                        str+="<td style='text-align: left;width: 150px;'>" +
                            "<div style='float: left'>" +
                            "<input name='priceMarket' type='text' value='"+proStr[i].priceMarket+"' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></div>" +
                            "</td>";
                        str+="<td style='text-align: left;width: 150px;'>" +
                            "<div style='float: left'>" +
                            "<input name='price' type='text' value='"+proStr[i].price+"' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></div>" +
                            "</td>";
                         str+="<td><input name='priceC' value='"+proStr[i].priceC+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";
                        str+="<td><input name='priceZ' value='"+proStr[i].priceZ+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";
						str+="<td><input name='priceG' value='"+proStr[i].priceG+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>"; 
						  /* str+="<td><input name='postFee' value='"+proStr[i].postFee+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";*/
                       str+="<td><input name='rebateOne' value='"+proStr[i].rebateOne+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";
						  str+="<td><input name='rebateTwo' value='"+proStr[i].rebateTwo+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";
                        str+="<td><input name='weight' value='"+proStr[i].weight+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";
                        if (proStr[i].isDefault){
                            str+="<td><input name='isDefault' type='radio' checked></td>";
						}else {
                            str+="<td><input name='isDefault' type='radio'></td>";
						}
                        /*str+="<td><a class='delSpec' href='javascript:;' style='color: #428bca'>删除</a></td>";*/
                      
                        $("#plist tbody").append(str);

                        var specSelect = proStr[i].spec.split("*");
                        console.log("spec-----------");
                        console.log(specSelect);
                        for (var j=0;j<specSelect.length;j++){
                            var specValueSelect = specSelect[j].split(":");
                            console.log("值------------");
                            valueSpec.push(specValueSelect[1]);

                            // $("#spec input[title='"+specValueSelect[1]+"']").prop("checked",true);
                            // $("#spec").find("input[type=checkbox][title='"+specValueSelect[1]+"']").prop("checked",true);
						}
					}


                    var spec ='';
                    for (o in [[${specList}]]){

                        spec+='<div class="spec" th:each="spList : ${specList}" style="float: left;padding-right: 10px;" ' +
                            'data-spec-name="'+[[${specList}]][o].spec.name+'" data-spec-type="'+[[${specList}]][o].spec.type+'" data-spec-id="'+[[${specList}]][o].spec.id+'"   >\n' +
                            '<span class="h5 mb10" style="float: left">' +
                            '<input class="specChkAll" type="checkbox">' +
                            '<strong >'+[[${specList}]][o].spec.name+'</strong></span>\n' +
                            '<div style="float: left;padding-left: 20px;">\n' ;

                        console.log("三连-----------------");
                        console.log([[${specList}]]);
                        console.log([[${specList}]][o]);
                        console.log([[${specList}]][o].specValList);
                        var specValList =[[${specList}]][o].specValList;



                        for(p in specValList){
                            if (isInArray(valueSpec,specValList[p].specValText)){
                                spec+='<div class="vl"  >\n' +
                                    '<input id="'+specValList[p].specValueId+'" type="checkbox" value="'+specValList[p].specValueId+'"\n' +
                                    'title="'+specValList[p].specValText+'" checked><span >'+specValList[p].specValText+'</span>\n' +
                                    '</div>' ;
                            }else {
                                spec+='<div class="vl"  >\n' +
                                    '<input id="'+specValList[p].specValueId+'" type="checkbox" value="'+specValList[p].specValueId+'"\n' +
                                    'title="'+specValList[p].specValText+'"><span >'+specValList[p].specValText+'</span>\n' +
                                    '</div>' ;
                            }

                        }
                        spec+='</div></div>';

                    }
                    $("#specParent").html(spec);


				}


			}





            $(".specChkAll").on("click",function(){
                if($(this).prop("checked")){
                    $(this).parent().parent().find("input[type=checkbox]").each(function(){
                        $(this).prop("checked",true);
                    });
                }else {
                    $(this).parent().parent().find("input[type=checkbox]").each(function(){
                        $(this).prop("checked",false);
                    });
                }
            });
            $("#plist .delSpec").on("click",function(){
                //console.log("找一下：："+JSON.stringify($(this).parent().parent()));

                $(this).parent().parent().remove();
            });
            $("#doProduct").on("click",function(){
                var specs=getSpec();
                console.log(specs);
                var product_name=[];
                var spec_values=[];
                var size=1;
                $.each(specs,function(i,s){
                    size=size * s.spec_values.length;
                    var t=[];
                    $.each(s.spec_values,function(j,o){
                        t.push(o);
                    });
                    spec_values.push(t);
                });
                $.each(getProducts(spec_values),function(i,v){
                    var n="";
                    $.each(v,function(j,s){
                        n=n+ s.spec_name+":"+ s.spec_value_name;
                        if(j< v.length-1)n+="*";
                    });
                    product_name.push(n);
                });
                if(spec_values.length<1){
                    layer.alert("至少选择一种规格");
                    return false;
                }
                //console.log("product_name::"+JSON.stringify(product_name));
                $("#plist tbody").html("");
                var i=0;
                var sku=[[${sku}]];
                var priceMarket=[[${priceMarket}]]||'';
                var price=[[${price}]]||'';
                 var priceC=[[${priceC}]]||'';
                var priceZ=[[${priceZ}]]||'';
				var priceG=[[${priceG}]]||''; 
                var buyMin=$("#buyMin").val()||'1';
                var buyMax=$("#buyMax").val()||'100';
              /* var postFee=[[${postFee}]]||'';*/
                var rebateOne=[[${rebateOne}]]||'';
				  var rebateTwo=[[${rebateTwo}]]||'';
                var weight=[[${weight}]]||'';
                var stock=[[${stock}]]||'';
                $.each(product_name,function(i,name){
                    i++;
                    var str="<tr >";
                    var bn="";
                    if(sku!=""){
                        bn=sku+"-"+i;
                    }
                    str+="<td>"+name+"</td>";
                    str+="<input name='productId' type='hidden' value=''>";
                    str+="<td><input name='sku' type='text' class='form-control'  value='"+bn+"' style='height: 22px;width: 80px;padding: 0 2px;'></td>";
                    str+="<td><input name='up' type='checkbox' checked></td>";
                    str+="<td><input name='stock' value=' "+stock+" ' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";
                    str+="<td><input name='buyMin' value='"+buyMin+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";
                    str+="<td><input name='buyMax' value='"+buyMax+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";
					str+="<td style='text-align: left;width: 150px;'>" +
							"<div style='float: left'>" +
							"<input name='priceMarket' type='text' value='"+priceMarket+"' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></div>" +
							"</td>";
                    str+="<td style='text-align: left;width: 150px;'>" +
						"<div style='float: left'>" +
						"<input name='price' type='text' value='"+price+"' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></div>" +
						"</td>";

                    str+="<td><input name='priceC' value='"+priceC+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";
                    str+="<td><input name='priceZ' value='"+priceZ+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";
					  str+="<td><input name='priceG' value='"+priceG+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";

						/*str+="<td><input name='postFee' value='"+postFee+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";*/


                    str+="<td><input name='rebateOne' value='"+rebateOne+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";
					 str+="<td><input name='rebateTwo' value='"+rebateTwo+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";
                    str+="<td><input name='weight' value='"+weight+"' type='text' class='form-control' style='height: 22px;width: 60px;padding: 0 2px;'></td>";
                    str+="<td><input name='isDefault' type='radio'></td>";
                    str+="<td><a class='delSpec' href='javascript:;' style='color: #428bca'>删除</a></td>";
                    $("#plist tbody").append(str);
                });
                $("#plist .delSpec").on("click",function(){
                    //console.log("找一下：："+JSON.stringify($(this).parent().parent()));
                    $(this).parent().parent().remove();
                });
                $("#plist .member").on("click",function(){
                    var self=$(this).parent().find("input[type=hidden]");
                });
            });
            $("#dialogSpecOK").on("click",function(){
                var isDefault=0;
                $("#plist tbody").find("input[name='isDefault']").each(function(){
                    if($(this).prop("checked"))isDefault++;
                });
                if(isDefault==1){
                    var specs=getSpec();
                    var spec_values=[];
                    var size=1;
                    $.each(specs,function(i,s){
                        size=size * s.spec_values.length;
                        var t=[];
                        $.each(s.spec_values,function(j,o){
                            t.push(o);
                        });
                        spec_values.push(t);
                    });
                    parent.$("#spec_values").val(JSON.stringify(specs));
                    var specs=[];
                    var specs_name="";
                    $("#plist tbody").find("tr").each(function(){
                        var self=$(this);
                        var spec=self.find("td:first").text();
                        specs_name+=spec+"|";
                        var productId=self.find("input[name='productId']").val();
                        var sku=self.find("input[name='sku']").val();
                        var disabled=self.find("input[name='up']").prop("checked")==false;
                        var stock=self.find("input[name='stock']").val();
                        var buyMin=self.find("input[name='buyMin']").val();
                        var buyMax=self.find("input[name='buyMax']").val();
                      	var priceMarket=self.find("input[name='priceMarket']").val();
                      	var price=self.find("input[name='price']").val();
                         var priceC=self.find("input[name='priceC']").val();
                        var priceZ=self.find("input[name='priceZ']").val();
						 var priceG=self.find("input[name='priceG']").val(); 
                       /* var postFee=self.find("input[name='postFee']").val();*/
                         var rebateOne=self.find("input[name='rebateOne']").val();
						 var rebateTwo=self.find("input[name='rebateTwo']").val();
                        var weight=self.find("input[name='weight']").val();
                        var isDefault=self.find("input[name='isDefault']").prop("checked")==true;
                        specs.push({'spec':spec,'productId':productId,'sku':sku,'disabled':disabled,'stock':stock,'buyMin':buyMin,'buyMax':buyMax,'priceMarket':priceMarket,'price':price,
                            'priceC':priceC,'priceZ':priceZ, 'priceG':priceG, 
                        	/*'postFee':postFee,*/ 'rebateOne':rebateOne,'rebateTwo':rebateTwo, 'weight':weight,'isDefault':isDefault});
                    });
                    parent.$("#hasSpec").val("1");
                    parent.$("#products").val(JSON.stringify(specs));
                    sessionStorage.setItem("products",JSON.stringify(specs));
                    parent.$("#sp").hide();
                    parent.$("#sp_new").html('<div class="form-group" id="gg_new">'+
                        '<label for="gg_new" class="col-sm-2 control-label">规格</label>'+
                        '<div class="col-sm-8">'+
                        '<button id="specEditBtn" class="btn btn-primary" style="float: left;" onclick="specEditBtn66()" type="button">编辑规格</button>'+
                        '<div style="float: left;text-align: left;">已设置'+specs.length+'个规格货品['+ specs_name+']</div>'+
                        '</div>'+
                        '</div>').show();
                    // parent.$("#specEditBtn").on("click",function(){
						// layer.open({
						// 	type:2,
						// 	title:"编辑规格",
						// 	area : [ '800px' ],
						// 	maxmin:true,
						// 	content:"/wx/goodsGoods/spec?id="+$("#typeId").val()+"&sku="+$("#sku").val()+"&price="+$("#price").val()+"&priceMarket="+$("#priceMarket").val()+"&weight="+$("#weight").val()
						// })
                    // });
                    var index = parent.layer.getFrameIndex(window.name); // 获取窗口索引
                    parent.layer.close(index);
                    // $("#dialogSpec").modal("hide");
                }else {
                    layer.alert("请选择一个货品为默认货品");
                    return false;
                }
            });
        });
        function isInArray(arr,value){
            for(var i = 0; i < arr.length; i++){
                if(value === arr[i]){
                    return true;
                }
            }
            return false;
        }
	</script>
</body>

</html>
